<template>
  <el-dialog title="商品详情"
             :visible.sync="dialogVisible"
             width="50%">
    <el-descriptions title="商品信息">
      <el-descriptions-item label="商品名称">{{goods.name}}</el-descriptions-item>
      <el-descriptions-item label="市场价格">{{goods.market_price}}</el-descriptions-item>
      <el-descriptions-item label="销售价格">{{goods.price}}</el-descriptions-item>
      <el-descriptions-item label="进价">{{goods.purchase_price}}</el-descriptions-item>
      <el-descriptions-item label="数量">{{goods.num}}</el-descriptions-item>
      <el-descriptions-item label="状态">
        <el-tag size="small"
                v-if="goods.status == 'active'"> {{goods.status | formatterStatus}}</el-tag>
        <el-tag size="small"
                type="danger"
                v-if="goods.status == 'unactive'"> {{goods.status | formatterStatus}}</el-tag>
      </el-descriptions-item>
      <el-descriptions-item label="描述">{{goods.make  }}</el-descriptions-item>
    </el-descriptions>
    <span slot="footer"
          class="dialog-footer">
      <el-button @click="dialogVisible = false">取 消</el-button>
      <el-button type="primary"
                 @click="dialogVisible = false">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>
export default {
  data () {
    return {
      dialogVisible: false,
      goods: {}
    }
  },
  filters: {
    formatterStatus (params) {
      if (params === 'active') {
        return '上架';
      } else if (params === 'unactive') {
        return '下架';
      } else {
        return '数据有问题';
      }
    }
  },
  methods: {
    open (id) {
      console.log("--------info------", id);
      this.getById(id);
      this.dialogVisible = true
    },
    getById (id) {
      this.axios.post('/goods/getById', { id: id }).then(res => {
        if (res.data.code == '2000') {
          this.goods = res.data.data[0]
        }
      })
    }
  }

}
</script>

<style lang="less" scoped>
</style>